import 'package:flutter/material.dart';
import '../../definitions/app.dart';
import '../../widgets/app_icon.dart';
import '../../widgets/auto_grid.dart';
import '../../wrappers/safe-area.dart';

class PracticeIndexPage extends StatefulWidget {
  const PracticeIndexPage({super.key});

  @override
  State<PracticeIndexPage> createState() => _PracticeIndexPageState();
}

class _PracticeIndexPageState extends State<PracticeIndexPage> {
  @override
  Widget build(BuildContext context) {
    return SafeAreaPageWrapper(
        padding: EdgeInsets.all(12),
        child: Column(
          children: [
            Container(
              alignment: Alignment.center,
              margin: EdgeInsets.only(bottom: 20),
              child: Text('请选择练习科目', style: TextStyle(fontSize: 22)),
            ),
            Expanded(
              child: AutoGrid(
                expectItemWidth: 80,
                expectItemHeight: 96,
                mainAxisSpacing: 10,
                crossAxisSpacing: 10,
                children: practiceAppList.map((item) {
                  return AppIcon(
                    autofocus: item.id == practiceAppList[0].id,
                    name: item.name,
                    icon: item.avatar,
                    backgroundColor: item.backgroundColor,
                    onConfirm: () {
                      Navigator.pushNamed(context, item.routerKey.name);
                    },
                  );
                }).toList(),
              ),
            )
          ],
        ));
  }
}
